<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- <base href="http://buyi.wooophone.com" />   -->
<link rel="shortcut icon" href="logo/buyi_16_16.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>布依在线-布依人自己的社区</title>
<meta name="keywords" content="布依在线,布依族,贵州布依族,布依族在线,布依,布依族文化,布依文化" />
<meta name="description" content="布依在线-布依人自己的社区。布依族，中国少数民族之一。现有2545059人，其中贵州省有200多万人，占布依族人口的95%以上。主要聚居在黔南和黔西南两个布依族苗族自治州，以及贵州的都匀、荔波、独山、平塘、镇宁等10个县（市）。其余散居于云南、四川、广西等省（区）。" />
<link href="css/common.css" rel="stylesheet" />
<style type="text/css">



.url_text { 
		width: 350px; 
		height: 45px; 
		background: #f1f3f4 url(../images/key.png) no-repeat 10px; 
		border: 1px solid #CCC; 
		border-radius: 5px;
		padding-left: 30px;
}
.gather_button { 
		cursor:pointer; 
		width: 80px; 
		height: 45px; 
		text-align: center; 
		line-height: 45px; 
		border: 1px solid #ccc; 
		background: #fff; 
		border-radius: 5px;
}
	
.operate{
		display: none;
}
	
.gather { text-align:center; border: 1px solid gray;}
.gather .click_items{margin-left:30px;}
.gather .click_ul li{ padding:20px; cursor: pointer;}
.gather .click_ul li .click_item{width:80px;}
.gather .like .like_item{padding:5px;width:100px;}
.gather .like li{height: 100px; overflow: hidden;}
	
</style>
</head>

<body>
	
	<div class="right gather">
	
		<div class="click_items">
			<ul class="click_ul">
				<li id="gather_url">
					<div><img class="click_item" src="images/get.png" /></div>
					<div>网址采集</div>
				</li>
				<li>
					<div><img class="click_item" src="images/gather_link.png" /></div>
					<div>网片连接</div>
				</li>
				<li>
					<div><img class="click_item" src="images/gather_upload.png" /></div>
					<div>上传图片</div>
				</li>
				<li>
					<div><img class="click_item" src="images/gather_board.png" /></div>
					<div>查看画板</div>
				</li>
			</ul>
			<div class="clear"></div>
			
		 	<div class="operate" id="operate">
				<input type="url" id="url" class="url_text" placeholder="http://" />
				<input type="button" class="gather_button" id="gather_button" value="采集">
		 	</div>
	 	</div>
	 	
	 	
	 	<div class="like" id="like">
			<ul>
				<li><img class="like_item" alt="" src="demopic/1.jpg"></li>
				<li>
					<img class="like_item" alt="" src="demopic/226x617.png">
				</li>
				<li>
					<img class="like_item" alt="" src="demopic/226x617.png">
				</li>
				<li>
					<img class="like_item" alt="" src="demopic/226x617.png">
				</li>
				<li>
					<img class="like_item" alt="" src="demopic/226x617.png">
				</li>
			</ul>
	 	</div>
	 	
 	</div>
 	
<script type="text/javascript" src="js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript">

	$(document).ready(function(){
		
		var $operate = $("div#operate");
		 
		$("#gather_url").click(function(){
			if($operate.css("display")=="none"){
				$operate.show(300);
			}else{
				$operate.hide(300);
			}
		});
		
		$("#gather_button").click(function(){
			var url="gather_image.json?callback=showimg&url="+$("#url").val();
			jsonp(url);
		});
		
	});
	
	function showimg(data){
		$ul = $("#like > ul");
		if(data.success){
			$ul.empty();
			for(var i=0; i<data.data.imgUrls.length;i++){
				var img = new Image();
				img.src=data.data.imgUrls[i];
				if(img.width>200){
					$ul.append("<li><img class=\"like_item\" alt=\"\" src=\""+data.data.imgUrls[i]+"\"></li>");
				}
			}
		}
	}

</script>
 	
 	
</body>
</html>
